Part 1
CSS! Let us get started with the basics. The CSS of a website changes the way the website looks, not functions, that's down to JS but we'll take a look at that later on. The CSS file of wikia, lives in the MediaWiki namespace at MediaWiki:Wikia.css/Monobook.css, so thus only recognises CSS, not plain wiki text and/or JS. So, viewing CSS for just you on one wikia, the whole wikia, or the same CSS for every wikia? Personal | Global | Wikia(click for screencaps) As you guessed, User:Original Authority/wikia.css enables custom styling on the wiki just for me. Only I will be able to see the changes this code makes and it will only be made on the wiki the page resides. Similarly User:Original Authority/global.css enables code that only I can see, but will be visible on every wiki I visit, and can only be applied at Community Wikia. As you probably guessed and the one you're probably most interested in MediaWiki:Wikia.css applies code placed in this page to the entire wikia and will be viewable by everyone, so if you break something, everyone will suffer. A nifty little trick that allows custom CSS/JS scripts is something called gadgets this can be activated through the gadgets tab in your preferences and allows you to activate scripts instead of having them activated for the entire wiki. So far, the wiki TVD, only has two enabled, one which is defunct. I'll work to add scripts that anyone would like to request in the future. Live CSS? Browser Console | Portable CSS Pad(click for screencaps) One great advantage of modern browsers is the fact that most, if not all, come bundled with a browser console that can be used to view live CSS in the browser without needing to access the code of the page. As you can see in the screencap above for the browser console, you can see what is called the selector of an article by hovering over it. The selector defines what is going to be styled. So for example p { color: blue; background: black; } Would make all text display blue with a background colour black as p is the universal selector for a paragraph tag which is basically text. One disclamer I must make now is that all CSS/HTML/JS is written in American English writing in any other language/British English will throw an error. You can change code straight in the browser console if you like but when you refresh, your code will dissapear. See the screenshot above for Portable CSS Pad, this can be used as an alternative for the browser console and was developed by a wiki user. This allows you to insert code into it which will be applied to the page, much like the browser console but in my opinion better. One thing to note, the !important code will allow you to force something to show, for example; if you are viewing a wiki page and in wikia.css you have the colour of text set to blue, but then you wish to use your browser console to change that colour to yellow, it you may not be able to because the two colours will be fighting eachother, to solve this add !important to the end and the colour yellow will be forced to show for example: p { color: yellow !important; }